<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<ul id="box">
    <li>aaaa</li>
    <li>bbbb</li>
    <li>cccc
        <div class="header">
            <div>头</div>
            <div>身体</div>
            <div>尾部</div>
        </div>
    </li>
    <li>eeee</li>
</ul>
<ul>
    <li>2aaaa</li>
    <li>2bbbb</li>
    <li>2cccc
        <div class="header">
            <div>2头</div>
            <div>2身体</div>
            <div>2尾部</div>
        </div>
    </li>
    <li>2eeee</li>
</ul>
<script>
    var box = document.getElementById('box');
    console.log(box.parentNode) ;     //parentNode父节点，找到了body
    console.log(box.childNodes);      //childNodes所有的子节点
    console.log(box.firstChild );       //firstChild 找到第一个子节点，打印出来的是文本节点text 3
    console.log(box.lastChild);       //lastChild找到最后一个子节点，打印出来的是文本节点 text 3
    console.log(box.childNodes[3]);     //获取所有子节点中的第三个节点内容
    console.log(box.firstChild.nextSibling )

</script>
</body>
</html>